﻿function makeScrollable(wrapper, scrollable) {
    // Get jQuery elements
    var wrapper = $(wrapper), scrollable = $(scrollable);

    // Hide images until they are loaded
    scrollable.hide();
    var loading = $('<div class="loading">Loading...</div>').appendTo(wrapper);

    // Set function that will check if all images are loaded
    var interval = setInterval(function() {
        var images = scrollable.find('img');
        var completed = 0;

        // Counts number of images that are succesfully loaded
        images.each(function() {
            if (this.complete) completed++;
        });

        if (completed == images.length) {
            clearInterval(interval);
            // Timeout added to fix problem with Chrome
            setTimeout(function() {

                loading.hide();
                // Remove scrollbars	
                wrapper.css({ overflow: 'hidden' });

                scrollable.slideDown('slow', function() {
                    enable();
                });
            }, 1000);
        }
    }, 100);

    function enable() {
        // height of area at the top at bottom, that don't respond to mousemove
        var inactiveMargin = 99;
        // Cache for performance
        var wrapperWidth = wrapper.width();
        var wrapperHeight = wrapper.height();
        // Using outer height to include padding too
        var scrollableHeight = scrollable.outerHeight() + 2 * inactiveMargin;
        // Do not cache wrapperOffset, because it can change when user resizes window
        // We could use onresize event, but it's just not worth doing that 
        // var wrapperOffset = wrapper.offset();

        // Create a invisible tooltip
        var tooltip = $('<div class="sc_menu_tooltip"></div>')
            .css('opacity', 0)
            .appendTo(wrapper);

        // Save menu titles
        scrollable.find('a').each(function() {
            $(this).data('tooltipText', this.title);
        });

        // Remove default tooltip
        scrollable.find('a').removeAttr('title');
        // Remove default tooltip in IE
        scrollable.find('img').removeAttr('alt');

        var lastTarget;
        //When user move mouse over menu			
        wrapper.mousemove(function(e) {
            // Save target
            lastTarget = e.target;

            var wrapperOffset = wrapper.offset();

            var tooltipLeft = e.pageX - wrapperOffset.left;
            // Do not let tooltip to move out of menu.
            // Because overflow is set to hidden, we will not be able too see it 
            tooltipLeft = Math.min(tooltipLeft, wrapperWidth - 75); //tooltip.outerWidth());

            var tooltipTop = e.pageY - wrapperOffset.top + wrapper.scrollTop() - 40;
            // Move tooltip under the mouse when we are in the higher part of the menu
            if (e.pageY - wrapperOffset.top < wrapperHeight / 2) {
                tooltipTop += 80;
            }
            tooltip.css({ top: tooltipTop, left: tooltipLeft });

            // Scroll menu
            var top = (e.pageY - wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - inactiveMargin;
            if (top < 0) {
                top = 0;
            }
            wrapper.scrollTop(top);
        });

        // Setting interval helps solving perfomance problems in IE
        var interval = setInterval(function() {
            if (!lastTarget) return;

            var currentText = tooltip.text();

            if (lastTarget.nodeName == 'IMG') {
                // We've attached data to a link, not image
                var newText = $(lastTarget).parent().data('tooltipText');

                // Show tooltip with the new text
                //				if (currentText != newText) {
                //					tooltip
                //						.stop(true)
                //						.css('opacity', 0)	
                //						.text(newText)
                //						.animate({opacity: 1}, 1000);
                //				}					
            }
        }, 200);

        // Hide tooltip when leaving menu
        wrapper.mouseleave(function() {
            lastTarget = false;
            tooltip.stop(true).css('opacity', 0).text('');
        });

        /*
        //Usage of hover event resulted in performance problems
        scrollable.find('a').hover(function(){
        tooltip
        .stop()
        .css('opacity', 0)
        .text($(this).data('tooltipText'))
        .animate({opacity: 1}, 1000);
	
        }, function(){
        tooltip
        .stop()
        .animate({opacity: 0}, 300);
        });
        */
    }
}

$(function(){
	if (window.console) console.log('window.height = ' + $(window).height());
	//if ($(window).height() != 650) $(window).height(650);
	//$('#photoVert').fadeOut(1);
	//$('#photoHorz').fadeOut(1);
	makeScrollable("div.sc_menu_wrapper", "div.sc_menu");
});
